// 添加管理员自定义hook

import { reactive } from 'vue'

interface FormdataTypes {
  name: string
  pass: string
  pass2: string
  email: string
}

interface RulesTypes {
  name: (
    | {
        required: boolean
        trigger: string
        message: string
        min?: undefined
        max?: undefined
      }
    | {
        trigger: string
        min: number
        max: number
        message: string
        required?: undefined
      }
  )[]
  pass: (
    | {
        required: boolean
        trigger: string
        message: string
        min?: undefined
        max?: undefined
      }
    | {
        trigger: string
        min: number
        max: number
        message: string
        required?: undefined
      }
  )[]
  pass2: (
    | {
        required: boolean
        trigger: string
        validator?: undefined
      }
    | {
        validator: (rule: any, value: any, callback: any) => void
        trigger: string
        required?: undefined
      }
  )[]
  email: {
    required: boolean
    trigger: string
    type: string
    message: string
  }[]
}

// 表单数据
export const formData = reactive<FormdataTypes>({
  name: '',
  pass: '',
  pass2: '',
  email: ''
})

// 验证密码
const validatePass = (rule: any, value: any, callback: any) => {
  if (value !== formData.pass) {
    callback(new Error('两次输入的密码不一样'))
  } else {
    callback()
  }
}

// 表单验证
export const rules = reactive({
  name: [
    { required: true, trigger: 'change', message: '请输入用户名' },
    { trigger: 'change', min: 2, max: 12, message: '请输入2~12位的用户名' }
  ],
  pass: [
    {
      required: true,
      trigger: 'change',
      message: '请输入密码'
    },
    {
      trigger: 'change',
      min: 6,
      max: 12,
      message: '请输入6~12位的密码'
    }
  ],
  pass2: [
    { required: true, trigger: 'change' },
    { validator: validatePass, trigger: 'change' }
  ],
  email: [
    {
      required: true,
      trigger: 'change',
      type: 'email',
      message: '输入合适的邮箱地址'
    }
  ]
})
